<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta charset="utf-8" />
<meta name="description" content="Mailbox with some customizations as described in docs" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<%@ include file="/include/person_include.jsp"%>
<style>
        .floor{
            width:1000px;
            height:716px;
            margin:50px auto;
            position:relative;
        }
        .rt-list{
            background: #fff;
            width: 740px;
            height:716px;
            padding-bottom: 0;
            position:absolute;
            top:0;
            right:0;
        }
        .mt{
            background:#568FF6;
            width: 220px;
            height:716px;
            padding-bottom: 0;
            position:absolute;
            top:0;
            left:0;
        }
        .mt>li{
            height: 84px;
            line-height: 84px;
            border-bottom: 1px solid #6EA5FF;
            cursor: pointer;
            background: #568FF6;
            position: relative;
        }
        .mt>li>a{
            font-size: 20px;
            color: #fff;
            padding-left: 15px;
            display: block;
            width: 193px;
            height: 84px;
        }
        .mt>li.current{
            color: #E6CB96;
        }
        .mt>li.current:after{
            content: "";
            width: 5px;
            height: 84px;
            position: absolute;
            top: 0;
            left:0;
            background: #FFCD04;
        }
        .rt-list>div{
            display:none;
        }
        .rt-list>div.active{
            display:block;
        }
    </style>

</head>
 <body class="bg">
<div class="floor">
    <ul class="mt">
        <li class="current">
            <a href="#person-msg">个人信息</a>
        </li>
        <li>
            <a href="#account">账户明细</a>
        </li>
        <li>
            <a href="#count">经营统计</a>
        </li>
        <li>
            <a href="#idea">意见反馈</a>
        </li>
        <li>
            <a href="#amend">修改密码</a>
        </li>
    </ul>
    <div class="rt-list">
        <div id="person-msg" class="active">
            <iframe src="${path}/apiH5/personMsg?businessId=${pd.businessId}&userId=${pd.userId}&token=${pd.token}" frameborder="0" style="width:740px;height:716px;"></iframe>
        </div>
        <div id="account">
            <iframe src="${path}/apiH5/personRecord?businessId=${pd.businessId}&userId=${pd.userId}&token=${pd.token}" frameborder="0" style="width:740px;height:716px;"></iframe>
        </div>
        <div id="count">
            <iframe src="${path}/apiH5/countItem?businessId=${pd.businessId}&userId=${pd.userId}&token=${pd.token}" frameborder="0" style="width:740px;height:716px;"></iframe>
        </div>
        <div id="idea">
            <iframe src="${path}/apiH5/personIdea?businessId=${pd.businessId}&userId=${pd.userId}&token=${pd.token}" frameborder="0" style="width:740px;height:716px;"></iframe>
        </div>
        <div id="amend">
            <iframe src="${path}/apiH5/personPwd?businessId=${pd.businessId}&userId=${pd.userId}&token=${pd.token}" frameborder="0" style="width:740px;height:716px;"></iframe>
        </div>
    </div>
     
    <script>
        (function(){
            $('.mt').on('click','li a',function(e){
                e.preventDefault();
                $(this).parent().addClass('current').siblings('.current').removeClass('current');
                var id=$(this).attr('href');
                $(id).addClass('active').siblings('.active').removeClass('active');
            });
        })();
    </script>
</body>
 
</html>